//找到网页上画图的位置，并且用ECharts初始化
var myChart = echarts.init(document.getElementById("idx1"));
  //配置绘图参数
  var option = {
     title: {
          text: 'XXX销量—周磊',
          left: 'center',
      },
      tooltip: {
          trigger: 'axis',
      },
     xAxis: {
         type: 'category',
         data: ['mon','tue','wed','thu','fri'],
         name: '日期',
     },
     yAxis: {
         name: '销量',
     },
     legend: {
        top:'bottom',
     },
     series:[{
         type:'scatter',
         data:[10,13,15,14,17],
         name: '馒头',
     },{
        type:'line',
        smooth: true,
        data:[7,4,5,9,8],
        name: '包子',
    },{
        type:'bar',
        data:[4,2,3,8,5],
        name: '烧饼',
    }]
  };
  //画图
  myChart.setOption(option);

//--------------------------------------------------
var myChart2 = echarts.init(document.getElementById("idx2"));
//配置绘图参数
var option2 = {
    title: {
        text: '仪表盘参数设置——周磊',
    },
    series:{
        type:'gauge',
        radius: "95%",
        data: [{
            name: '速度',
            value: 80,
            title:{
                show:true,
                color:'red',
                backgroundColor:'yellow',
                fontSize:15
            },
            detail:{
              show:true,
              color:'black',
              //backgroundColor:'yellow',
              fontSize:15,
              formatter:'{value} km/s'
            },
        }],
        axisLine: {
            lineStyle: {
                color: [
                  [0.3, 'red'], // 0~10% 红轴
                  [0.6, 'green'], // 10~20% 绿轴
                  [1, 'blue'], // 20~30% 蓝轴
                ],
            },
        },
        axisTick: {
          //   show: false,
        },
        axisLabel: {
            show: false,
        },
        min: 20,
        max: 200,
       //  data:[1,2,3],
        
    }
};
//画图
myChart2.setOption(option2);


var myChart3 = echarts.init(document.getElementById("idx3"));
//配置绘图参数
var option3 = {
    title: {
        text: '雷达—周磊',
    },
    //图例
    legend: {
        left: 'right',
        orient: 'vertical',
    },
    //视觉映射组件visualMap
    visualMap: [{
        color:['yellow','green','blue'],
        min:59,
        max:100,
        calculable:true,
        orient: 'horizontal',
        left:'center'
    }],
    radar: {
        //五门课
        indicator: [{
            name: '语文',
            max: 100,
        },{
           name: '数学',
           max: 100,
       },{
           name: '英语',
           max: 100,
       }],
       //菱形——>圆形
       //圆环的个数与颜色
       shape: 'circle',
       splitNumber: 10,
       splitArea: {
           areaStyle: {
               color: ['red','white'],
           },
       },
    },
    series: [{
        type:'radar',
        data: [{
            //五门课的成绩
            value: [90,95,99],
            name: '小明',
        },{
           value: [65,70,75],
           name: '老王',
       },,{
           value: [60,60,60],
           name: '小红',
       }],
    }],
 };
//画图
myChart3.setOption(option3);



 //找到网页上画图的位置，并且用echarts初始化这个区域
 var myChart4 = echarts.init(document.getElementById("idx4"));
 //配置绘图参数
 var option4 = {
     title: {
         text: '马斯洛需求层次—周磊',
     },
     series: [{
         type:'funnel',
         sort: 'ascending',
         data:[{
             value: 1,
             name: 'a',
             itemStyle: {
                 color: 'red',
             },
         },2,3],
     }],
  };
 //画图
 myChart4.setOption(option4);


 var myChart5 = echarts.init(document.getElementById("idx5"));
 //配置绘图参数
 var option5 = {
     //组件
     title: {
        text: '成绩占比---圆环图周磊',
        subtext: '20大数据',
     },
     legend: {
         left: 'center',
         top: 'bottom',
     },
     tooltip: {
         formatter: '{b}:{c}({d}%)',
     },
     series:{
         type:'pie',
         radius: ['60%', '85%'],
         data:[{
             value: 1,
             name: '优',
            },{
            value: 3,
            name: '良',
            },{
            value: 4,
            name: '中',
            },{
            value: 2,
            name: '差',
         }], 
         label: {
             color: 'black',
             position: 'inner',
         },
     },
    
 };
 //画图
 myChart5.setOption(option5);


var myChart6 = echarts.init(document.getElementById("idx6"));
//配置绘图参数
var option6 = {
    title:{
        text:'某品牌品牌销量对比——周磊',
        left: 'center',
    },
    grid: {
        left: '18%',
        right: '20%',
        bottom: '22%',
        top: '19%',
    },
    xAxis: {
        type: 'category',
        data: ["A","B","C","D"],
        name: '厂商',
    },
    yAxis: {
        name: 'Y',
        min: 100,
        max: 1500,
    },
    legend: {
        bottom: 'bottom',
    },
    series: [{
        type:'bar',
        name: '手机销量',
        data: [500,400,200,300],
        label: {
            show: true,
            position: 'top',

        },
        stack: '总量',
    },{
        type:'bar',
        name: 'PC销量',
        data: [400,500,300,200],
        label: {
            show: true,
            position: 'top',
        },
        stack: '总量',
    },{
        type:'bar',
        name: '平板销量',
        data: [450,330,180,390],
        label: {
            show: true,
            position: 'top',
        },
        stack: '总量',
    }],
};
myChart6.setOption(option6);
// var myChart3 = echarts.init(document.getElementById("idx3"));
// //配置绘图参数
// var option3 = {
//     legend: {},
//     tooltip: {},
//     dataset: {
//       source: [
//         ['product', '2015', '2016', '2017'],
//         ['Matcha Latte', 43.3, 85.8, 93.7],
//         ['Milk Tea', 83.1, 73.4, 55.1],
//         ['Cheese Cocoa', 86.4, 65.2, 82.5],
//         ['Walnut Brownie', 72.4, 53.9, 39.1]
//       ]
//     },
//     xAxis: { type: 'category' },
//     yAxis: {},
//     // Declare several bar series, each will be mapped
//     // to a column of dataset.source by default.
//     series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
//   };
// myChart3.setOption(option3);